<template>
    <div class="news-detail">
        <div class="news-detail__content" v-show="newshow">
            <h2 class="news-detail__title">{{news.title}}</h2>
            <div class="news-detail__subtitle"><span>{{new Date(news.time).format("yyyy-MM-dd hh:mm:ss")}}</span></div>
            <div>
                <div ref="newsContent" class="newsContent" style="font-size: 0.96rem;"></div>
            </div>
        </div>
    </div>
</template>
<script>
  import $ from 'jquery';
  export default {
    data() {
      return {
          news:{},
          newshow:false,
      }
    },
    mounted() {
        let newsID=this.GetLastRoute(this.$route.path); 
        this.fetchnews(newsID);
    },
    methods:{
        extraNews(){
            let Elements=[];
            this.news.contents.forEach(element => {
                if(element.type=='文本'){
                    Elements.push(`<p>${element.value.content}</p>`)
                }
                else if(element.type=='图片'){
                    Elements.push(`<p style="text-align: center;"><span><img src="${element.value.content}" title="" style="max-width: 100%;"></span></p>`)
                    if(element.value.discrible){
                        Elements.push(`<p style="text-align: center;"><span><strong ><span>${element.value.discrible}</span></strong></span></p>`)
                    }
                }
                else if(element.type=='视频'){
                    Elements.push(`<p style="text-align: center;"><video class="edui-upload-video  vjs-default-skin video-js" controls="" preload="none" width="420" src="${element.value.content}" data-setup="{}"></video></p>`)
                    if(element.value.discrible){
                        Elements.push(`<p style="text-align: center;"><span><strong ><span>${element.value.discrible}</span></strong></span></p>`)
                    }
                    
                }
                Elements.push(`<p><span>&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;</span></p>`)
            });
            if(this.news.from){
                Elements.push(`<p ><strong style="color: rgb(0, 122, 170);">来源：${this.news.from}</strong></p>`)
            }
            let contents = Elements.join('');
            this.$refs.newsContent.innerHTML=contents;
        },
        fetchnews(newsID) {
            this.newshow=false
            let that=this;
            let ajaxSet={
                type:"get",
                async:true,
                dataType:"json",
                url:window.Glod.ajax+'xzqh/search_news_id?',
                data:{
                    id:newsID,
                }  
            }
            $.ajax(ajaxSet)
            .then(databack=>{
                if(databack.status==true){
                    this.news=databack.result;
                    that.extraNews();
                    this.newshow=true
                }
                
            });
        },
    }
    
  }
</script>